<template>
  <div class="we_component we_audio">
    <div class="noaudio" v-if="!data.url">
      <i class="icon icon-yuyin"></i>
      <p class="tip" style="text-align:center;">请选择音频</p>
    </div>
    <audio-player v-else :src="data.url" :title="data.title"></audio-player>
<!--     <audio v-else :src="data.url" controls="controls" style="width:100%;">
      您的浏览器不支持 audio 标签。
    </audio> -->
  </div>
</template>
<script>
  import audioPlayer from '@/components/common/audioPlayer'
  export default {
    props: ['data', 'title'],
    components: {audioPlayer}
  }
</script>
<style lang="scss">
  .we_audio{
    .noaudio{padding-bottom:10px;text-align:center;line-height:1;color:#ccc;}
    .tip{margin-top:-5px;}
    .icon{font-size:100px;color:#ccc;}
  }
</style>
